<template>
    <view class="wf-item-page">
      <image :src="getImgUrl(item.imageUrl)" mode="widthFix" class="item-img" :lazy-load="true" />
      <view class="item-info">
        <image :src="item.wxImg" mode="aspectFill" class="info-avatar" :lazy-load="true" />
        <view class="info-nickname">{{ item.evalutaion }}</view>
      </view>
    </view>
  </template>
  
  <script>
  export default {
    props: {
      item: {
        type: Object,
        require: true,
      },
    },
    methods: {
      getImgUrl(row) {
        if (!row) return "";
        let result = row.split(";");
        return result[0] || "";
      },
    },
  };
  </script>
  
  <style lang="scss" scoped>
  .wf-item-page {
    background: #fff;
    overflow: hidden;
    border-radius: 5px;
  }
  
  .item-img {
    width: 100%;
  }
  
  .item-info {
    display: flex;
    padding: 5px;
  }
  
  .info-avatar {
    width: 25px;
    height: 25px;
    border-radius: 50%;
    margin-right: 5px;
  }
  
  .info-nickname {
    flex: 1;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 25rpx;
    color: #333;
  }
  </style>
  